<template>
  <br>
  <h3 style="color: red"><strong>{{title}}</strong></h3> <br>

  <button @click="addNums">尾部添加一个6</button> <br>

  <ul>
    <li v-for="(num,index) of nums" :key="index">{{num}}</li>
  </ul>

  <br>
  <button @click="concatNums">拼接两个数组</button> <br>
  <h3>nums2</h3>
  <ul>
    <li v-for="(num,index) of nums2" :key="index">{{num}}</li>
  </ul>
  <h3>nums3</h3>
  <ul>
    <li v-for="(num,index) of nums3" :key="index">{{num}}</li>
  </ul>
  <br>
</template>

<script>
export default {
  name: "Demo",
  data(){
    return{
      title:"14.数组变化侦测",
      nums:[1,2,3,4],
      nums2:[1,2,3,4],
      nums3:[5,6,7,8]
    }
  },
  methods:{
    addNums(){
      this.nums.push(6);
    },
    concatNums(){
      this.nums2=this.nums2.concat(this.nums3);
    }
  }
}
</script>

<style scoped>

</style>